<template>
  <div class="loading">Loading . . .</div>
</template>


<script lang="ts">
import { gsap } from 'gsap'
export default defineComponent({
  setup() {
    const data = reactive({

    })




    const loadAnimation = () =>{
      const tween = gsap.timeline({delay: 0.8})
      tween.to('.loading', {
        duration: 0.5,
        opacity: 0,
        ease: 'power2',
        display: 'none'
      })
      
    }

    onMounted(() => {
      loadAnimation()
    })


    
  return {
    data,
    loadAnimation
  }
  }

})

</script>